import { onUnmounted } from 'vue'

const useDOMCreate = (nodeId: string): void => {
  const node = document.createElement('div')
  node.id = nodeId
  document.body.appendChild(node)

  // 当前 hook 导入到哪个组件中，相当于往目标组件中混入了相关功能
  // 因此该 onUnmounted 实际上监听的是目标组件的销毁钩子
  onUnmounted(() => {
    document.body.removeChild(node)
  })
}

export default useDOMCreate
